<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<f:metadata>
	<f:event listener="#{searchTransactionsManageBean.onLoad()}"
		type="preRenderView"></f:event>
</f:metadata>
<h:head>
	<ui:param name="root" value="#{request.contextPath}" />
</h:head>
<h:body>
	<ui:composition template="/Group2/masterPage.xhtml">
		<ui:define name="content">
			<!-- start content -->
			<div id="content">
				<div id="page-heading"></div>
				<!-- end page-heading -->

				<table border="0" width="100%" cellpadding="0" cellspacing="0"
					id="content-table">
					<tr>
						<th rowspan="3" class="sized"><h:graphicImage
								library="group2" name="images/shared/side_shadowleft.jpg"
								width="20" height="300" alt="" /></th>
						<th class="topleft"></th>
						<td id="tbl-border-top">&nbsp;</td>
						<th class="topright"></th>
						<th rowspan="3" class="sized"><h:graphicImage
								library="group2" name="images/shared/side_shadowright.jpg"
								width="20" height="300" alt="" /></th>
					</tr>
					<tr>
						<td id="tbl-border-left"></td>
						<td>
							<!--  start content-table-inner ...................................................................... START -->
							<div id="content-table-inner">

								<!--  start table-content  -->
								<div id="table-content">
									<!-- Start Search -->
									<h:form>
										<p:panel id="panel3" style="margin-bottom:10px;"
											header="Search Detail">
											<h:panelGrid columns="3">
												<p:outputLabel value="IDCardNumb :" for="IDCardNumber" />
												<p:inputText id="IDCardNumber"
													value="#{searchTransactionsManageBean.iDCardNumber}"
													size="20" required="true">
													<f:validateLength minimum="9" maximum="12" />
												</p:inputText>
												<p:message for="IDCardNumber" />
												<p:outputLabel value="From Date :" for="fDate" />
												<p:inputText id="fDate"
													value="#{searchTransactionsManageBean.fDate}" size="20"
													required="true" styleClass="datepicker">
													<f:convertDateTime pattern="dd/MM/yyyy" />
												</p:inputText>
												<p:message for="fDate" />
												<p:outputLabel value="To Date :" for="tDate" />
												<p:inputText id="tDate"
													value="#{searchTransactionsManageBean.tDate}" size="20"
													required="true" styleClass="datepicker">
													<f:convertDateTime pattern="dd/MM/yyyy" />
												</p:inputText>
												<p:message for="tDate" />
												<p:outputLabel />
												<h:commandButton id="bigbutton" value="Submit"
													styleClass="myButton"
													action="#{searchTransactionsManageBean.search()}" />
											</h:panelGrid>
										</p:panel>
									</h:form>
									<br />
									<!-- End Search -->

									<!--  start customer information -->
									<!-- start customer table -->
									<p:panel id="panel4" style="margin-bottom:10px;"
										header="Customer Detail"
										rendered="#{searchTransactionsManageBean.customer ne null}">
										<h:panelGrid columns="2">
											<p:outputLabel value="IDCardNumb :" for="idCardNumber" />
											<p:inputText id="idCardNumber" readonly="true"
												value="#{searchTransactionsManageBean.customer.idCardNumber}" />
											<p:outputLabel value="First Name :" for="firstName" />
											<p:inputText id="firstName" readonly="true"
												value="#{searchTransactionsManageBean.customer.firstName}" />
											<p:outputLabel value="Last Name :" for="lastName" />
											<p:inputText id="lastName" readonly="true"
												value="#{searchTransactionsManageBean.customer.lastName}" />
										</h:panelGrid>
									</p:panel>
									<br />
									<!--  end customer-table................................... -->
									<!-- end customer information -->

									<!--  start Transaction-table ..................................................................................... -->
									<p:panel id="panel7" header="TRANSACTIONS LIST"
										rendered="#{searchTransactionsManageBean.listTransactions ne null}"></p:panel>
									<h:dataTable id="product-table"
										rendered="#{searchTransactionsManageBean.listTransactions ne null}"
										value="#{searchTransactionsManageBean.listTransactions}"
										var="l" border="0" width="100%" cellpadding="0"
										cellspacing="0" headerClass="table-header-repeat line-left">
										<h:column>
											<!-- column header -->
											<f:facet name="header">
													Transaction ID
												</f:facet>
											<!-- row record -->
											<h:outputText value="#{l.transactionID}">
												<f:convertNumber />
											</h:outputText>
										</h:column>
										<h:column>
											<f:facet name="header">
													Transaction Related
												</f:facet>
											<h:outputText value="#{l.relatedTransaction}">
												<f:convertNumber />
											</h:outputText>
										</h:column>
										<h:column>
											<f:facet name="header">Deposit Account Number</f:facet>
											<h:outputText value="#{l.depositAccountNumber}">
												<f:convertNumber />
											</h:outputText>
										</h:column>
										<h:column>
											<f:facet name="header">Type</f:facet>
											<h:outputText value="#{l.transactionType}" />
										</h:column>
										<h:column>
											<!-- column header -->
											<f:facet name="header">Funds</f:facet>
											<!-- row record -->
											<h:outputText value="#{l.funds}">
												<f:convertNumber pattern="#,###,##0.00" />
											</h:outputText>

										</h:column>
										<h:column>
											<f:facet name="header">Sender</f:facet>
											<h:outputText value="#{l.senderID}">
												<f:convertNumber />
											</h:outputText>
										</h:column>
										<h:column>
											<f:facet name="header">Receiver</f:facet>
											<h:outputText value="#{l.receiverID}">
												<f:convertNumber />
											</h:outputText>
										</h:column>
										<h:column>
											<f:facet name="header">State</f:facet>
											<h:outputText value="#{l.transactionState}" />
										</h:column>
										<h:column>
											<f:facet name="header">Begin Time</f:facet>
											<h:outputText value="#{l.beginTime}">
												<f:convertDateTime pattern="dd/MM/yyyy hh:mm:ss" />
											</h:outputText>
										</h:column>

										<h:column>
											<f:facet name="header">End Time</f:facet>
											<h:outputText value="#{l.endTime}">
												<f:convertDateTime pattern="dd/MM/yyyy hh:mm:ss" />
											</h:outputText>
										</h:column>
										<h:column>
											<f:facet name="header">Current Balance</f:facet>
											<h:outputText value="#{l.currentBalance}">
												<f:convertNumber pattern="#,###,##0.00" />
											</h:outputText>
										</h:column>
										<h:column>
											<f:facet name="header">After Balance</f:facet>
											<h:outputText value="#{l.afterBalance}">
												<f:convertNumber pattern="#,###,##0.00" />
											</h:outputText>
										</h:column>
										<h:column>
											<f:facet name="header">Creater</f:facet>
											<h:outputText value="#{l.createdBy}">
												<f:convertNumber />
											</h:outputText>
										</h:column>
										<h:column>
											<f:facet name="header">Approver</f:facet>
											<h:outputText value="#{l.approvedBy}">
												<f:convertNumber />
											</h:outputText>
										</h:column>
									</h:dataTable>
									<!--  end Transaction-table................................... -->
								</div>
								<!--  end content-table  -->
								<!--  start actions-box ............................................... -->
								<!-- end actions-box........... -->
								<!--  start paging..................................................... -->
								<!--<table border="0" cellpadding="0" cellspacing="0" id="paging-table">
			<tr>
			<td>
				<a href="" class="page-far-left"></a>
				<a href="" class="page-left"></a>
				<div id="page-info">Page <strong>1</strong> / 15</div>
				<a href="" class="page-right"></a>
				<a href="" class="page-far-right"></a>
			</td>
			<td>
			<select  class="styledselect_pages">
				<option value="">Number of rows</option>
				<option value="">1</option>
				<option value="">2</option>
				<option value="">3</option>
			</select>
			</td>
			</tr>
			</table> -->
								<!--  end paging................ -->

								<div class="clear"></div>

							</div> <!--  end content-table-inner ............................................END  -->
						</td>
						<td id="tbl-border-right"></td>
					</tr>
					<tr>
						<th class="sized bottomleft"></th>
						<td id="tbl-border-bottom">&nbsp;</td>
						<th class="sized bottomright"></th>
					</tr>
				</table>
				<div class="clear">&nbsp;</div>

			</div>
			<!--  end content -->
			<div class="clear">&nbsp;</div>
		</ui:define>
	</ui:composition>

</h:body>
</html>
